<!doctype html>
<html lang="">

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>微信管理</title>

  <!-- Disable tap highlight on IE -->
  <meta name="msapplication-tap-highlight" content="no">

  <link href="styles/bootstrap.min.css" rel="stylesheet">
  <link href="styles/dashboard.css" rel="stylesheet">
</head>

<body>
  <!-- Add your site or app content here -->

  <nav class="navbar navbar-inverse navbar-fixed-top">
    <div class="container-fluid">
      <div class="navbar-header">
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
        <a class="navbar-brand" href="/">微信管理</a>
      </div>
      <div id="navbar" class="navbar-collapse collapse">
        <ul class="nav navbar-nav navbar-right">
          <li><a href="/">首页</a></li>
          <li><a href="/userinfo.html">微信号管理</a></li>
          <li><a href="/ads_list.html">广告列表</a></li>
          <li><a href="/logout.html">登出</a></li>
        </ul>
      </div>
    </div>
  </nav>

  <div class="container-fluid">
    <div class="row">
      <div class="col-sm-3 col-md-2 sidebar">
        <ul class="nav nav-sidebar">
          <li class="active"><a href="#">Overview <span class="sr-only">(current)</span></a></li>
        </ul>
      </div>
      <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
        <h1 class="page-header">个人信息</h1>


        <div class="table-responsive">
          <table class="table table-striped">
            <thead>
              <tr>
                <th>#</th>
                <th>备注</th>
                <th>appid</th>
                <th>appsecret</th>
                <th>状态</th>
                <th>广告</th>
                <th>操作</th>
              </tr>
            </thead>
            <tbody id='list'></tbody>
          </table>
        </div>

        <form class="form-horizontal" id="new-wx">
          <fieldset>
            <div class="">
              <legend class="">新增微信账号</legend>
            </div>
            <div class="control-group">
              <label class="control-label">备注</label>
              <div class="controls">
                <input type="text" name="remark">
              </div>
            </div>
            <div class="control-group">
              <label class="control-label">appid</label>
              <div class="controls">
                <input type="text" name='appid'>
              </div>
            </div>

            <div class="control-group">
              <label class="control-label">appsecret</label>
              <div class="controls">
                <input type="text" name="appsecret">
              </div>
            </div>

            <div class="control-group">
              <div class="controls">
                <a class="btn btn-success" onclick="addnew()">新增</a>
              </div>
            </div>

          </fieldset>
        </form>

      </div>
    </div>
  </div>

  <!-- Built with love using Web Starter Kit -->
  <script src="scripts/pace.min.js"></script>
  <script src="scripts/jquery.min.js"></script>
  <script src="scripts/bootstrap.min.js"></script>
  <script src="scripts/config.js"></script>
  <script>
    checkLogin();

    $.get(server_host + '/user/wx', function(data) {
      if (data.info.code == 200) {
        var items = data.item.wx_accounts;
        var tbody = '';
        for (var i = 0; i < items.length; i++) {
          tbody += "<tr>"
          tbody += "<td>" + (i + 1) + "</td>"
          tbody += "<td>" + items[i].remark + "</td>"
          tbody += "<td>" + items[i].appid + "</td>"
          tbody += "<td>" + items[i].appsecret + "</td>"
          tbody += "<td>今日剩余" + items[i].left_num + "次</td>"
          if (items[i].ad_title != '') {
            var ad = "<a href='/band_ad.html?appid=" + items[i].appid + "'>切换广告</a>";
          } else {
            var ad = "<a href='/band_ad.html?appid=" + items[i].appid + "'>绑定广告</a>";
          }
          tbody += "<th>" + items[i].ad_title + ad + "</th>";
          if (items.length > 1) {
            tbody += "<td><a href='#' onclick=\"del(" + i + ")\">删除</a></td>"
          } else {
            tbody += "<td></td>"
          }
          tbody += "</tr>"
        }
        $('#list').append(tbody);
      }
    }, 'json')

    function del(n) {
      //todo 之后改用del
      $.post(server_host + '/user/wx/' + n, {}, function(data) {
        if (data.info.code == 200) {
          location.reload();
        } else {
          alert(data.info.codeMessage);
        }
      }, 'json')
    }

    function addnew() {
      $.post(server_host + '/user/wx', $('#new-wx').serialize(), function(data) {
        if (data.info.code == 200) {
          location.reload();
        } else {
          alert(data.info.codeMessage);
        }
      }, 'json')
    }
  </script>
</body>

</html>